<template>
    <div>
        <!-- {{yi_data}} -->
        <div class="des">
            &emsp;<el-button type="text" @click="fanhui">{{fan}}</el-button>&emsp;&emsp;&emsp;&emsp;
            &emsp;&emsp;&emsp;{{yi_data.namel}}医生
        </div>
        <div class="des2" v-for="(value,i) in yi_datal" :key="i">
            <div class="des3">
                <el-avatar><img :src="yi_data.img" alt=""></el-avatar>&emsp;&emsp;
                {{yi_data.name}}&emsp;&emsp;&emsp;<font color="gray" size="2">{{yi_data.cong}}</font><br><br>
                    <font size="2px">解答次数：{{value.answer_num}}</font>&emsp;&emsp;
                    <font size="2px">综合评分&emsp;{{value.synth}}</font>&emsp;&emsp;
                    <font size="2px">粉丝数&emsp;{{value.fans_num}}</font>
            </div>
            <div class="des3">
                <div class="des4">个人简介</div><br>
                <div>
                    &emsp;<font color="gray" size="2">{{value.brief}}</font>
                </div>
            </div>
            <div class="des3">
                <div class="des4">擅长领域</div><br>
                <div>
                    &emsp;<font color="gray" size="2">{{value.territory}}</font>
                </div>
            </div>
            <div class="des3">
                <div class="des4">所在医院</div><br>
                <div class="des5">
                    <div class="des6">
                        <img :src="value.hospital_img" style="width:85px" alt="">
                    </div>
                    <div class="des7">
                        {{value.hospital_name}}<br>
                        <el-rate v-model="value1"></el-rate>
                        <font color="gray" size="2">{{value.hospital_addr}}</font> 
                    </div> 
                </div>
            </div>
            <div class="des3">
                <div class="des4">评价</div><br>
                <div>
                    <div v-for="(value,i) in yong" :key="i">
                        <el-avatar icon="el-icon-user-solid"><img :src="value.img" alt=""></el-avatar>&emsp;{{value.username}}&emsp;&emsp;{{value.time}}
                    </div><br>
                    &emsp;&emsp;&emsp;&emsp;<font color="gray" size="2">{{value.evaluate}}</font>
                </div>
            </div><br><br>
            <div>
                <el-button type="warning" style="width:320px" round @click="wenzhen">我要问诊</el-button>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    data(){
        return{
            // 获取医生ID：
            yi_id : this.$route.params.id,
            // 存储单个数据：
            yi_data:{},
            yi_datal:[],
            fan:'<',
            yong:[]
        }
    },

    methods:{
        get_desc(){
            this.axios.get('inqu/one/' + this.yi_id)
            .then(resp=>{
                console.log(resp)
                this.yi_data = resp.data.dat
                this.yi_datal = resp.data.datz
                this.yong = resp.data.yong
            }).catch(err=>{
                console.log(err)
            })
        },
        fanhui(){
            this.$router.push('doctor')
        },
        wenzhen(){
            this.$router.push({name:'WenInquiry',params:{'id':this.yi_id}})
        }
    },
    mounted(){
        console.log(this.yi_id)
        this.get_desc();
    }
}
</script>

<style>
    .des{
        width: 340px;
        height: 30px;
        background-color: orange;
        color:white;
        text-align: center;
        padding-top: 6px;
        border-radius: 10px;
        padding-top: 20px;
        text-align: left;
    }
    .des2{
        width: 340px;
        height: 500px;
        background-color: aqua;
        margin-top: 20px;
    }
    .des3{
        width: 340px;
        height: 100px;
        background-color:azure;
        border-radius: 10px;
        margin-top: 10px;
        text-align: left;
    }
    .des4{
        width: 90px;
        height: 30px;
        border-radius: 10px;
        background-color: orange;
        color: white;
        text-align: left;
    }
    .des5{
        width: 200x;
        height: 60px;
        display: flex;
        /* justify-content: space-between; */
    }
    .des6{
        width: 90px;
        height: 60px;
        /* background-color: aquamarine; */
        margin-left: 20px;
        margin-top: -10px;
    }
    .des7{
        width: 220px;
        /* background-color: blue; */
        height: 60px;
        margin-top: -10px;
    }
</style>    